<template>
	<view class="my-store-info">
		<view class="my-top">
			<view class="main-title">店铺地址信息</view>
			<view class="content">
				<u-cell-group>
					<u-cell :isLink="true" arrow-direction="right">
						<view slot="title" class="u-slot-title1">
							<text class="u-cell1">所在地区</text>
						</view>
						<view slot="value" class="tips1">
							<popupActivity class="u-cell4 flag" :newselectVal="[
                  storeInfo.provinceName || '',
                  storeInfo.cityName || '',
                  storeInfo.areaName || '',
                ]" @change="change">
								<view v-if="cityFlag" class="city-name">{{
                  storeInfo.merchantProvince +
                  storeInfo.merchantCity +
                  storeInfo.merchantCounty
                }}</view>
								<view v-else class="city-name" style="display: flex; padding-left: 30vw">请选择</view>
							</popupActivity>
						</view>
					</u-cell>
					<u-cell>
						<view slot="title" class="u-slot-title1">
							<text class="u-cell1">详细地址</text>
						</view>
						<view slot="value" class="tips1">
							<u-input v-model="storeInfo.merchantAddress" type="text" input-align="right"
								placeholder="请输入详细地址" />
						</view>
					</u-cell>
					<u-cell @click="openMap()" :isLink="true" arrow-direction="right">
						<view slot="title" class="u-slot-title1">
							<text class="u-cell1">定位地址</text>
						</view>
						<view slot="value" class="tips1">
							<u-input v-model="areaName3" :readonly="true" type="text" input-align="right"
								placeholder="请点击获取定位" />
						</view>
					</u-cell>
				</u-cell-group>
			</view>
		</view>
		<view class="sub1">
			<u-button @click="getSubmit" type="primary" text="下一步"></u-button>
		</view>
		<u-popup :show="showTip" mode="center" @close="closeTip" @open="openTip" round="20rpx">
			<view class="tip-box">
				<text class="tip-word">是否继续填写资料开通收款？</text>
				<view class="tip-button-box">
					<view class="tip-button-left" @tap="complete()">完成申请</view>
					<view class="tip-button-right" @tap="nextJump()">开通收款</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	const app = getApp();
	const globalData = app.globalData;
	const apiUrl = globalData.wxApi;
	const wxImg = globalData.wxImg;
	import {
		getStoreData,
		dealNum,
		httpPost,
		bdMapToTxMap,
		txMapToBdMap,
	} from "@/utils/http.js";
	import mpMixin from "@/uni_modules/uview-ui/libs/mixin/mpMixin";
	const pic1 = require(`@/img/my/my1.png`);
	import popupActivity from "./component/popupActivity";
	//#ifdef MP-WEIXIN
	const chooseLocation = requirePlugin("chooseLocation");
	//#endif

	export default {
		data() {
			return {
				wxImg,
				apiUrl,
				dealNum,
				pic1,
				cityFlag: false,
				storeInfo: {
					 merchantAddress:"",//商户详细地址
					 merchantProvince:"",//省
					 merchantProvinceCode:"",
					 merchantCity:"",//市
					 merchantCityCode:"",
					 merchantCounty:"",//区县
					 merchantCountyCode:"",
					 latitude:"",//纬度
					 longitude:"",//经度
				},
				parameter:{},
				areaName3:"",
				userInfo: {},
				flag: false,
				title: "",
				showTip: false,
				addressInfo:{
					province:"",
					provinceCode:"",
					city:"",
					cityCode:"",
					area:"",
					areaCode:""
				}
			};
		},
		components: {
			popupActivity,
		},
		onShow() {
			//#ifdef MP-WEIXIN
			const location = chooseLocation.getLocation(); // 如果点击确认选点按钮，则返回选点结果对象，否则返回null
			console.log('选择定位',location)
			
			//#endif
			if (location) {
				const longAndLat = txMapToBdMap(location.longitude, location.latitude);
				this.storeInfo = {
					...this.storeInfo,
					...longAndLat
				};
				this.areaName3=location.name;
				this.storeInfo.merchantAddress=this.areaName3;
				console.log(this.storeInfo)
			}
		},
		onUnload() {
			// 页面卸载时设置插件选点数据为null，防止再次进入页面，geLocation返回的是上次选点结果
			//#ifdef MP-WEIXIN
			chooseLocation.setLocation(null);
			//#endif
		},
		onLoad(options) {
			//console.log(options)
			
			if(options&&options.parameter){
				this.parameter=JSON.parse(options.parameter);
				//console.log(this.parameter)
				this.storeInfo.merchantAddress=this.parameter.merchantAddress;
				this.areaName3=this.parameter.merchantAddress;
				this.storeInfo.merchantProvince=this.parameter.merchantProvince;//省
				this.storeInfo.merchantProvinceCode=this.parameter.merchantProvinceCode;
				this.storeInfo.merchantCity=this.parameter.merchantCity;//市
				this.storeInfo.merchantCityCode=this.parameter.merchantCityCode;
				this.storeInfo.merchantCounty=this.parameter.merchantCounty;//区县
				this.storeInfo.merchantCountyCode=this.parameter.merchantCountyCode;
				if(this.parameter.latitude){
					this.storeInfo.latitude=this.parameter.latitude;//纬度
				}else{
					this.storeInfo.latitude="";
				}
				if(this.parameter.longitude){
					this.storeInfo.longitude=this.parameter.longitude;//经度
				}else{
					this.storeInfo.longitude="";
				}
				
				this.cityFlag = true;
			}
			if(this.storeInfo.latitude==""||this.storeInfo.latitude==""){
				const _this = this;
				console.log("定位28")
				uni.getLocation({
					isHighAccuracy: true, // 开启地图精准定位
					type: "gcj02", // 地图类型写这个
					// type: "wgs84", //gcj02
					success(res) {
						console.log("resMap:", res);
						const latitude = res.latitude;
						const longitude = res.longitude;
						const longAndLat = txMapToBdMap(longitude, latitude);
						_this.storeInfo = {
							..._this.storeInfo,
							...longAndLat,
						};
					},
					fail: (err) => {
						// 获取定位失败
					},
				});
			}
			
			// const creatStoreInfo = uni.getStorageSync('creatStoreInfo');
			// if(creatStoreInfo){
			// 	this.storeInfo=creatStoreInfo;
				
				
			// }
			console.log(this.parameter)
			
		},
		methods: {
			getSubmit() {
				if(!this.storeInfo.merchantProvince){
					uni.showToast({
						icon: "none",
						title: "请选择所在地区"
					});
					return;
				}
				if(!this.storeInfo.merchantAddress){
					uni.showToast({
						icon: "none",
						title: "请填写店铺详细地址"
					});
					return;
				}
				this.showTip = true;
				
			
			},
			openMap() {
				console.log("定位1")
				if (!this.storeInfo.longitude) {
					const _this = this;
					console.log("定位2")
					setTimeout(() => {
						_this.openMap();
					}, 500);
					return;
				}
				const key = "5KCBZ-PG3LW-UILRN-YDIJH-HP4EZ-PCFBP"; //使用在腾讯位置服务申请的key
				const referer = "中盈联盟商家"; //调用插件的app的名称
				let obj = bdMapToTxMap(this.storeInfo.longitude, this.storeInfo.latitude);
				const location = JSON.stringify({
					...obj,
				});
				const category = "生活服务,娱乐休闲";
                console.log("定位3")
				uni.navigateTo({
					url: "plugin://chooseLocation/index?key=" +
						key +
						"&referer=" +
						referer +
						"&location=" +
						location +
						"&category=" +
						category,
				});
			},
			toPage(v) {
				uni.navigateTo({
					url: v,
				});
			},
			change(data) {
				console.log(data)
				this.addressInfo=data.address;
				this.storeInfo.provinceName = data.address.province;
				this.storeInfo.cityName = data.address.city;
				this.storeInfo.areaName = data.address.area;
				this.storeInfo.merchantProvince=data.address.province;//省
				this.storeInfo.merchantProvinceCode=data.address.provinceCode;
				this.storeInfo.merchantCity=data.address.city;//市
				this.storeInfo.merchantCityCode=data.address.cityCode;
				this.storeInfo.merchantCounty=data.address.area;//区县
				this.storeInfo.merchantCountyCode=data.address.areaCode;
				
				this.parameter.merchantProvince=data.address.province;//省
				this.parameter.merchantProvinceCode=data.address.provinceCode;
				this.parameter.merchantCity=data.address.city;//市
				this.parameter.merchantCityCode=data.address.cityCode;
				this.parameter.merchantCounty=data.address.area;//区县
				this.parameter.merchantCountyCode=data.address.areaCode;
			
				
				this.cityFlag = true;
			},
			upload() {
				const self = this;
				uni.chooseImage({
					success(res) {
						uni.uploadFile({
							url: self.apiUrl + "/api/upload/store",
							filePath: res.tempFilePaths[0],
							name: "file",
							async success(res) {
								let data = JSON.parse(res.data);
								if (data.code != 0) {
									uni.showToast({
										title: data.message,
										icon: "none",
									});
									return;
								}
								self.storeInfo.imgLogo =
									data.data[0].path + "/" + data.data[0].name;
							},
							fail(error) {
								uni.showToast({
									title: "上传失败！",
									icon: "none",
								});
							},
						});
					},
				});
			},
		
			closeTip() {
				this.showTip = false;
			},
			openTip() {
				this.showTip = true;
			},
			//完成申请
			complete() {
				let that=this;
				let params={...this.storeInfo,...this.parameter};
				if(this.areaName3==""){
					uni.showToast({
						title: "请选择定位！",
						icon: "none",
					});
					return
				}
					httpPost("/api/sellerstore/applyUnion", params)
						.then((res) => {
							console.log(res)
							that.showTip = false;
							if (res.code == 0) {
								uni.switchTab({
									url: '/pages/index/home'
								});
							}
						})
						.catch((e) => {});
				
			},
			nextJump() {
				let params={...this.parameter,...this.storeInfo};
			
				if(this.areaName3==""){
					uni.showToast({
						title: "请选择定位！",
						icon: "none",
					});
					return
				}
				uni.navigateTo({
				  url: "/pages/storeManage/legalPersonInfo?parameter="+JSON.stringify(params)
				});
				this.showTip = false;
			   // httpPost("/api/sellerstore/apply", params)
			   // 	.then((res) => {
			   // 		console.log(res)
			   		
			   // 	})
			   // 	.catch((e) => {});
				
				
			}
			
		},
	};
</script>

<style lang="scss">
	.my-store-info {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background: #f8f8f8;
		width: 100vw;
		min-height: 100vh;
		padding: 16px;

		.sub1 {
			margin: 24px 0;

			/deep/.u-button {
				width: 78vw;
				height: 50px;
				line-height: 50px;
			}

			/deep/.u-button__text {
				font-size: 16px;
			}
		}
/deep/ .u-input{
	  flex: 2
  }
		.content {
			background: #fff;
			border-radius: 4px;
			padding: 0 16px;
			box-sizing: border-box;
			margin-bottom: 16px;
			flex-direction: column;
			width: calc(100vw - 32px);

			.tips1 {
				min-width: 210px;
				display: flex;
				justify-content: flex-end;
			}

			/deep/.u-border {
				border: none;
			}

			.no-store-h1 {
				margin: 24px 0;
				font-size: 16px;
				color: #333;
				text-align: center;
				width: 100%;
			}

			.no-store-h2 {
				margin: 24px 0;
				font-size: 14px;
				color: #666;
				text-align: center;
				width: 100%;
			}

			/deep/.u-cell__body {
				padding: 16px 0 !important;
			}

			/deep/.u-cell-group__wrapper {
				.u-line:first-child,
				.u-cell:last-child .u-line {
					display: none !important;
				}
			}
		}

		.u-slot-title1 {
			display: flex;
			flex-direction: column;

			.u-cell1 {
				font-size: 16px;
				line-height: 30px;
				color: #333;
			}

			.u-cell2 {
				font-size: 14px;
				margin-left: 6px;
				line-height: 30px;
				color: #f39d21;
			}

			.u-cell3 {
				font-size: 14px;
				line-height: 30px;
				color: #999;
				min-width: 50px;
			}

			.u-cell4 {
				font-size: 14px;
				line-height: 30px;
				color: #333;

				&.flag {
					min-width: 50vw;
					display: flex;
					justify-content: flex-end;
					text-align: right;
				}
			}
		}

		.my-top {
			display: flex;
			flex-direction: column;
			width: 100%;

			.ava {
				width: 40px;
				height: 40px;
				border-radius: 40px;
				overflow: hidden;
			}
			.main-title{
				font-size: 28rpx;
				margin-bottom: 20rpx;
			}
		}
	}

	.tip-box {
		width: 500rpx;
		padding: 40rpx;
		text-align: center;
		font-size: 28rpx;

		.tip-button-box {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			margin-top: 60rpx;

			.tip-button-left {
				color: #c2c2c2;
				font-size: 24rpx;
				width: 50%;
				position: relative;
			}

			.tip-button-right {
				color: #ba8a24;
				font-size: 24rpx;
				width: 50%;
			}

			.tip-button-left:after {
				display: block;
				content: "";
				width: 2rpx;
				height: 40rpx;
				background-color: #c9c9c9;
				position: absolute;
				right: 0;
				top: 0;
			}
		}
	}
</style>